import ContentLoader, { IContentLoaderProps } from 'react-content-loader'

const Skeleton = (props: IContentLoaderProps) => (
  <ContentLoader
    speed={2}
    width={300}
    height={160}
    viewBox="0 0 300 160"
    backgroundColor="#dedede"
    foregroundColor="#ecebeb"
    {...props}
  >
    <rect x="48" y="8" rx="3" ry="3" width="88" height="6" />
    <rect x="48" y="26" rx="3" ry="3" width="52" height="6" />
    <rect x="-2" y="81" rx="22" ry="22" width="410" height="6" />
    <rect x="-34" y="105" rx="3" ry="3" width="380" height="6" />
    <rect x="3" y="55" rx="76" ry="76" width="178" height="6" />
    <circle cx="18" cy="19" r="18" />
  </ContentLoader>
)

export default Skeleton
